import { Layout } from 'antd';
import { connect } from 'dva';
import React from 'react';
import Folder from '../../components/folder';
import BasicLayout from '../../layout/BasicLayout';
import styles from './Pan.less';

const { Content } = Layout;

const Pan = () => {

  const handleShare = fileId => {
    alert('share:' + fileId);
  };

  const handleDownload = fileId => {
    alert('download:' + fileId);
  };

  const handleDelete = fileId => {
    alert('delete:' + fileId);
  };

  const generateRandomString = (length) => {
    if (length < 4) {
      length = 4;
    }
    const x = "0123456789qwertyuioplkjhgfdsazxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM";
    let tmp = "";
    for (let i = 0; i < length; i++) {
      tmp += x.charAt(Math.ceil(Math.random() * 100000000) % x.length);
    }
    return tmp;
  };

  const generateRandomFileList = (size) => {
    let list = [];
    for (let i = 0; i < size; ++i) {
      let obj = {
        fileId: i,
        fileName: generateRandomString(Math.random() * 10),
        type: parseInt(Math.random() * 100000000) % 4 === 0 ? 'folder' : 'file',
      };
      list.push(obj);
    }
    return list;
  };

  const fileList = generateRandomFileList(Math.random() * 90 + 10);

  return (
    <BasicLayout title="Pan">
      <Content className={styles.content}>
        <Folder fileList={fileList} selectMode={true} onShare={handleShare}
                onDownload={handleDownload} onDelete={handleDelete} />
      </Content>
    </BasicLayout>
  );
};

export default connect()(Pan);
